<template>
  <div>
    <!-- 面包屑导航 -->
    <div>
      <el-breadcrumb separator="/"  style="font-size:20px">
        <el-breadcrumb-item >
          <i class="el-icon-s-goods"></i>{{$t('i18n.thing')}}
        </el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <div class="container">
          <span>{{$t('i18n.tips')}}</span>
          <el-button type="primary" round class="btn" @click="$i18n.locale= $i18n.locale==='zh'?'ft':'zh'">{{$t('i18n.btn')}}</el-button>
          <div class="list">
              <div>{{$t('i18n.p1')}}</div>
               <div>{{$t('i18n.p2')}}</div>
                <div>{{$t('i18n.p3')}}</div>
          </div>
          <h2>{{$t('i18n.title2')}}</h2>
          <div>
              <i18n path="i18n.info" tag="p">
                  <a place="action"
                    href="https://kazupon.github.io/vue-i18n/zh/introduction.html"
                  >{{$t('i18n.value')}}</a>
              </i18n>
          </div>
    </div>
  </div>
</template>

<script>
export default {};
</script>

<style scope>
.el-icon-s-goods{
  margin-right:10px;
}
.btn{
    margin-left:10px
}
</style>